:root {
    --font: Roboto, HelveticaNeue-Light, Helvetica Neue Light, Helvetica Neue, Helvetica, Arial, Lucida Grande,
        sans-serif;
    --font-code: Consolas, Monaco, Andale Mono, Ubuntu Mono, monospace;
    --shadow: 59, 66, 82;
    --primary: 94, 129, 172;
    --secondary: 129, 161, 193;
    --radius: 4px;
    --line-width: 1px;
    --neutral: 46, 52, 64;
    --solid: 76, 86, 106;
    --line: 216, 222, 233;
    --background: 236, 239, 244;
    --surface: 255, 255, 255;
}

[data-theme='dark'] {
    --neutral: 236, 239, 244;
    --solid: 216, 222, 233;
    --line: 67, 76, 94;
    --background: 37, 41, 50;
    --surface: 46, 52, 64;
}

html {
    width: 100%;
    min-height: 100vh;

    @mixin scrollbar;
}

body {
    margin: 0;
    height: 100%;
    min-height: 100vh;
    background: palette(background);
    font-family: var(--font);
    transition: all 0.4s ease-in-out;
}

#app {
    height: 100%;
    min-height: 100vh;
    display: flex;
    width: 100%;
    height: 100%;
}

.milkdown {
    @mixin query 72rem {
        min-height: auto;
        border-radius: var(--radius);
        max-width: 72rem !important;
        width: 100%;
    }
    transition: all 0.4s ease-in-out;
}
